  .activity-page {
    display: flex;
    flex-direction: column;
    background-color: #ffffff;
  }

  .activity-header {
      justify-content: center; /* 确保子元素在主轴上居中 */
      align-items: center;
      padding: 10px;
      background-color: #1E90FF; /* 标题栏的背景颜色 */
  }

  .back-arrow {
    margin-right: 8px;
    color: #ffffff; /* Adjust back arrow color */
  }

  .activity-banner {
    width: 100%;
    height: 200px; /* Adjust banner height as needed */
    margin-bottom: 12px;
  }
  .background-image{
	    background-image: url('/static/活动详情页面图片/活动详情背景1.jpg'); /* 设置背景图 */
	    background-size: cover; /* 覆盖整个容器 */
	    background-position: center; /* 居中背景图 */
	    padding: 16px;
  }

  .activity-info {
    padding: 16px;
	color: white;
  }

  .activity-time,
  .activity-description,
  .join-button {
    margin-bottom: 30px;
	font-size: 40rpx;
	margin-left: 30rpx;
  }

  .join-button {
    background-color: #007AFF;
    color: white;
    padding: 10px 20px;
    border-radius: 5px;
    border: none;
    margin-top: 20px; /* 增加上边距以向下移动按钮 */
    width: 80%; /* 如果需要按钮宽度为容器宽度的80% */
    display: block; /* 使按钮成为块级元素 */
    margin-left: auto; /* 自动左边距 */
    margin-right: auto; /* 自动右边距 */
  }

  .activity-content,
  .activity-rules,
  .rewards-section {
    padding: 16px;
    background-color: #f0f0f0; /* Light gray background for sections */
    border-radius: 8px;
    margin-top: 12px;
  }

  .content-title,
  .rules-title {
    font-weight: bold;
    margin-bottom: 4px;
  }

  .reward-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
  }

  .claim-button {
    background-color: #28a745; /* Green color for the claim button */
    color: white;
    padding: 6px 12px;
    border-radius: 5px;
    border: none;
    margin-top: 12px;
  }
  